<script setup>
document.title = '轩铭2512 - 统一账号 - 账号管理 - 登录日志'
import { ref } from 'vue'
import cookie from 'js-cookie'
import request from '../../request'
const accesstoken = cookie.get('accessToken')
const loginlog = ref([])
async function get() {
  const res = await request({
    apiPath: '/account/getLoginLog',
    body: {
      accessToken: accesstoken
    }
  })
  TinyModal.message({
    message: '获取数据成功',
    status: 'success'
  })
  const typemap = {
    emailcode: '邮箱验证码',
    mfa: 'MFA',
    password: '密码',
    passkey: '通行密钥',
    sslwxxcx: 'SSL 证书（微信小程序）',
    huawei: '华为账号'
  }
  const outloginlog = res.data.map(item => ({
    ...item,
    verifyType: typemap[item.verifyType]
  }))
  loginlog.value = outloginlog
}
get()
</script>

<template>
  <div>
    <tiny-alert :closable="false" description="仅展示近 30 天最多 10 条最新登录日志。"></tiny-alert>
    <tiny-grid :data="loginlog">
      <tiny-grid-column field="verifyType" title="验证方式" align="center"></tiny-grid-column>
      <tiny-grid-column field="ipAddress" title="地点" align="center"></tiny-grid-column>
      <tiny-grid-column field="ip" title="IP" align="center"></tiny-grid-column>
      <tiny-grid-column field="ua" title="UserAgent" align="center"></tiny-grid-column>
      <tiny-grid-column field="date" title="时间" align="center" format-text="longDateTime"></tiny-grid-column>
    </tiny-grid>
  </div>
</template>